import { Component } from '@angular/core';
import { NavController, NavParams, InfiniteScroll } from 'ionic-angular';
import { Park } from '../../providers/park-data/park';
// import { ParkDetailPage } from '../park-detail/park-detail';
import { ParkDataProvider } from '../../providers/park-data/park-data';
import { ReadPage } from '../book-read/read';

/**
 * Generated class for the ParkMapPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@Component({
  selector: 'page-park-map',
  templateUrl: 'park-map.html',
})
export class ParkMapPage {
  parks: Park[]=[];

  private num:number=10;//每页显示的记录数
  private curPage:number=1;//当前页数

  private hasMore:boolean=true;//是否更多数据
  constructor(public navCtrl: NavController, public navParams: NavParams,
    public parkDateProviter:ParkDataProvider) {
  }
  
  ionViewDidLoad() {
    this.getParks(this.num,this.curPage);
  }
  getParks(num:number,page:number):void{
    this.parkDateProviter.getParks(num,page).subscribe(parks=>{
      // this.parks=parks;
      // 保留原有数据
      if(parks.length>0){
        //合并数组
        this.parks=this.parks.concat(parks);
      }else{
        this.hasMore=false;
      }
    });
  }
   // 向下滚动加载数据的方法
   doInfinite(infiniteScroll:InfiniteScroll):void{
    if(!this.hasMore){
      infiniteScroll.complete();
      return;
    }
    setTimeout(()=>{
      this.curPage+=1;
      this.getParks(this.num,this.curPage);
      infiniteScroll.complete();
    },500)
  }
  /**
   * 点击进入详情页面
   * @param park 
   */
  itemTapped(park:Park):void{
    this.navCtrl.push(ReadPage,{park:park});
  }
  
}
